<template>
  <div>
    <router-view/>
    <footer>
      <van-tabbar v-model="active" @change='changeNav'>
        <van-tabbar-item v-for='(item,index) in footer' :key="index" :info='item.message' :to='item.url'>
          <div slot='icon'>
            <van-icon name="like-o" />
          </div>
          {{item.text}}
        </van-tabbar-item>
      </van-tabbar>
    </footer>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        active:0,
        footer: [
          {
            text:'消息',
            message:1,
            icon:'',
            url:{ path: "/index"}
          }, {
            text:'通讯录',
            message:1,
            icon:'',
             url:{ path: "/index/addressBook"}
          }, {
            text:'发现',
            message:1,
            icon:'',
            url:{ path: "/index/found"}
          },  {
            text:'我',
            message:1,
            icon:'',
             url:{ path: "/index/my"}
          },
        ]
      }
    },
    methods:{
      changeNav(e){
        this.active = e
        console.log(e)
      }
    }
  }
</script>

<style scoped>

</style>